<!DOCTYPE html >
<html xmlns:th="http://www.thymeleaf.org" xmlns:tiles="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>管理</title>
<link type="text/css" rel="stylesheet" th:href="@{/css/page.css}"/>
<script type="text/javascript" th:src="@{/js/jquery/jquery-3.3.1.js}"></script>
<!-- mmGrid -->
<link rel="stylesheet" type="text/css" th:href="@{/plug/mmGrid/mmGrid.css}"/>
<script type="text/javascript"  th:src="@{/plug/mmGrid/mmGrid.js}" ></script>
<!-- mmGrid page -->
<link rel="stylesheet" type="text/css" th:href="@{/plug/mmGrid/mmPaginator.css}"/>
<script type="text/javascript" th:src="@{/plug/mmGrid/mmPaginator.js}" ></script>

<!-- layer -->
<link type="text/css" rel="stylesheet" th:href="@{/plug/layui/css/layui.css}"  media="all"/>
<script type="text/javascript" th:src="@{/plug/layui/layui.js}"  charset="utf-8"></script>

<link type="text/css" rel="stylesheet" th:href="@{/js/layer/skin/layer.css}"/>
<script type="text/javascript" th:src="@{/js/layer/layer.js}" ></script>
<style type="text/css">
</style>

</head>
<body>
<div  lay-allowclose="true" style="margin-left:15px; width: 98%">
<div class="first_div" style="border:none;">
	<table class="param_table" style="margin-left:10px;" >
		<tr>
			<td style="width:150px;">
				<span>名称：</span>
				<input type="text" id="name" name="name" class="input_0" />
			</td>
			<td style="">
			<div class="layui-btn-group">
			  <button class="layui-btn" onclick="search()">查询</button>
			  <button class="layui-btn" onclick="addRow()">增加</button>
			</div>
			</td>
		</tr>
	</table>
	
	<div style="margin:3px 10px 10px 10px;"></div>
	<div id="exampleTableUser" style="margin-top:5px;" ></div>
	<div id="paginator11-1" align="right" style="margin-right:10px;" ></div>
</div>
</div>
</body>
</html>

<script type="text/javascript">


$(function(){	
	//表格
	$('#exampleTableUser').mmGrid({
    	root:'rows',// 和后台数据保存列一致,对应MMGridPageVoBean rows
		url:"/user/pet/getAllByLimit",
    	width: 'auto',
    	height: 'auto',
    	//checkCol: true,
    	fullWidthRows: true, //表格第一次加载数据时列伸展，自动充满表格
    	showBackboard: false,
        //multiSelect: true,
        indexCol: true,  //索引列
        params:function(){
        	var param = new Object();
        	param.name = $.trim($("#name").val());
        	return param;
        },
        cols: [{title: 'ID', name: 'id', width:60, hidden:true},
			   {title: '名称', name: 'name', width:20},
			   {title: '体重(Kg)', name: 'weight', width:10},
			   {title: '身高(cm)', name: 'height', width:10},
			   {title: '出生时间', name: 'birthday', width:30},
			   {title: '类型', name: 'type', width:20, renderer:function(val, item, rowIndex){
			   			console.log(val);
					   console.log(item);
					   var t = "";
					   switch (val) {
						   case '1': t = "猫科";break;
						   case '2': t = "犬科";break;
					   }
					   return t;
			   }},{title: '操作', name: 'id', width:60, renderer:function(val, item, rowIndex){
					var buttonStr ='<span class=" layui-btn layui-btn-danger layui-btn-sm" onclick="dontPass('+"\'"+item.id+"\'"+')" >删除</span>'+
							'<span class=" layui-btn layui-btn-sm" onclick="dontPass('+"\'"+item.id+"\'"+", 2"+')" >预约就诊</span>'+
							'<span class=" layui-btn layui-btn-sm" onclick="bl('+"\'"+item.id+"\'"+", 3"+')" >查看病例</span>';
					return "<div class='span_btus' >" + buttonStr + "</div>";
				}}
           ],
        plugins : [
        	$('#paginator11-1').mmPaginator({
        		totalCountName: 'total',    //对应MMGridPageVoBean count
        		page: 1,                    //初始页
        		pageParamName: 'page',      //当前页数
        		limitParamName: 'limit', //每页数量
        		limitList: [10, 20, 30, 50]
        	})
        ]
    });
});

//查询
function search(){
	$('#exampleTableUser').mmGrid().load({"page":1});
}

function addRow(){
	layer.open({
	    type: 2,
	    title: '增加',
	    area: ['60%', '70%'],
	    content: '/user/pet/add' //iframe的url
	});
}

function apply(id){
	layer.open({
		type: 2,
		title: '预约申请',
		area: ['60%', '70%'],
		content: '/user/apply/add?id='+id //iframe的url
	});
}
function bl(id) {
	layer.open({
		type: 2,
		title: '病例详情',
		area: ['95%', '60%'],
		content: '/user/diagnosis/diagnosisList?petId='+id //iframe的url
	});
}

function dontPass(id, flg) {
	var param = new Object();
	param.id = id;
	param.type = flg;
	var str = '确认删除吗？';
	if (flg==2){
		str = "前去预约就诊?";
	}
	layer.confirm(str, {icon: 3, title:'提示'}, function(index){
		$.ajax({
			type:"POST",
			async:true,  //默认true,异步
			data:param,
			url:"/user/pet/del",
			success:function(data){
				console.log(data);
				if(data == "SUCCESS"){
					layer.alert('操作成功！', {icon: 1}, function(indexOk){
						search();
						layer.closeAll();
					});
				}else if(data == "app"){
					//预约
					apply(param.id);
				}else{
					layer.alert('操作失败！', {icon: 2}, function(indexNo){
						layer.closeAll();
					});
				}
			}
		});
	});
}

</script>